<template>
	<view class="page" :style="{minHeight:windowHeight+'px'}">
		<view class="item-box">
			<!-- <view class="item" v-for="(item,index) of 3">
				<view class="item-con1">
					<view class="item-con1-head">06日</view>
					<view class="item-con1-content">
						<view class="item-con1-type">提现-尾号5555</view>
						<view class="item-con1-time">2020-2-2 20:22</view>
					</view>
				</view>
				<view class="item-con2">
					<view class="item-con2-price">3000元</view>
					<text>交易成功</text>
				</view>
			</view> -->
			<view class="item" v-for="(item,index) of listData" @click="gotoDetail(item.id)">
				<view class="item-con1">
					<view class="item-con1-head">{{item.day}}日</view>
					<view class="item-con1-content">
						<view class="item-con1-type">
							<!-- <text v-if="item.type==1">微信</text>
							<text v-if="item.type==2">支付宝</text>
							<text v-if="item.type==3">银行卡</text> -->
							 充值
						</view>
						<view class="item-con1-time">{{item.create_time}}</view>
					</view>
				</view>
				<view class="item-con2">
					<view class="item-con2-price">{{item.pay_price}}元</view>
					<!-- <text v-if="item.pay_status == 0">处理中</text> -->
					<text v-if="item.pay_status == 1">充值成功</text>
					<text v-if="item.pay_status == 0">充值失败</text>
				</view>
			</view>
		</view>
		<view class="nullmsg d-c-c p30" v-if="listData.length == 0">
			<text class="iconfont icon-wushuju"></text>
			<text class="cont">亲，暂无相关记录哦</text>
		</view>
		<view v-else v-show="isLoadMore">
			<uni-load-more :loadingType="loadding"></uni-load-more>
		</view>
	</view>
</template>

<script>
	import uniLoadMore from '@/components/uni-load-more.vue';
	export default {
		components: {
			uniLoadMore
		},
		data() {
			return {
				windowHeight:'',
				listData:[],//提现记录内容
				tailNum:[],//尾号
				dayTime:'',//
				oadStatus: 'loading', //加载样式：more-加载前样式，loading-加载中样式，nomore-没有数据样式
				isLoadMore: false, //是否加载中
				page: 1,
				pagesize: 10,
				loadding:0,
			};
		},
		onLoad() {
			this.getData();
			uni.getSystemInfo({
				success: (res) => {
					this.windowHeight =res.windowHeight
				}
			});
		},
		onPullDownRefresh() {
			this.page = 1;
			this.listData = [];
			setTimeout( () => {
				uni.stopPullDownRefresh();
			}, 1000);
			this.getData();
		},
		onReachBottom() { //上拉触底函数
			if (!this.isLoadMore) { //此处判断，上锁，防止重复请求
				this.isLoadMore = true
				this.page += 1
				this.getData();
			}
		},
		methods:{
			/* 详情 */
			gotoDetail(id){
				uni.navigateTo({
					url:'/pages/user/my-wallet/skype_order/detail/detail?select=1&&id='+id
				})
			},
			/* 获取提现记录 */
			getData(){
				let self = this;
				uni.showLoading({
					title:'加载中',					
				});
				self._post('order.order/recharge_order',{page:self.page},function(res){
					
					//self.listData = res.data.list.data;
					if (res.data.list.data) {
						self.listData = self.listData.concat(res.data.list.data)
						if (res.data.list.data.length < self.pagesize) { //判断接口返回数据量小于请求数据量，则表示此为最后一页
							self.isLoadMore = true
							self.loadding = 2
						} else {
							self.isLoadMore = false
						}
					} else {
						self.isLoadMore = true
						self.loadding = 2
					}
					self.listData.forEach(item =>{
						//let arr1 = item.bank_number;
						//let arr2 = arr1.substring(arr1.length-4,arr1.length);
						//item.Num = arr2;
						let time1 = item.create_time;
						let time2 = time1.substring(8,10);
						item.day = time2;
					})
					uni.hideLoading();
				});
			}
		}
	}
</script>

<style lang="scss">
.page{
	width: 100%;
	height: 100%;
	background-color: #F4F4F4;
	overflow: hidden;
}
.item-box{
	margin-top: 20rpx;
}
.item{
	//width: 97%;
	margin: 0 auto;
	background-color: #FFFFFF;
	margin-top: 2rpx;
	padding: 0 20rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.item-con1{
	display: flex;
	align-items: center;
}
.item-con1-head{
	color: #999999;
	font-size: 32rpx;
	margin-right: 20rpx;
	padding: 0rpx 20rpx;
	padding-left: 0;
	border-right: 2rpx solid #F4F4F4;
}
.item-con1-content{
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	padding: 20rpx 0;
}
.item-con1-time{
	margin-top: 10rpx;
	color: #999999;
}
.item-con2{
	display: flex;
	flex-direction: column;
	align-items: center;
}
.item-con2 text{
	color: #F9040A;
	font-size: 18rpx;
}
.item-con2-price,.item-con1-type {
	font-size: 32rpx;
}
</style>
